@charset "utf-8";
$font: 12px/1.5 'Microsoft YaHei', '宋体', Regular, '黑体', Arial, "Lucida Grande", Verdana;
$c-black: #282727;
$c-green: #a8ce3b;
$c-grenn-dark: #a0c634;
$c-grey: #f5f5f5;

@mixin dur($sec: 1s){
    -webkit-animation-duration: $sec;
    animation-duration: $sec;
}

.ani-fromleft{
    -webkit-animation-name: fromleft;
    animation-name: fromleft;
}
.ani-scalein{
    -webkit-animation-name: scale-in;
    animation-name: scale-in;
    -webkit-animation-duration: .6s;
    animation-duration: .6s;
}

@-webkit-keyframes fromleft {
    from {
        -webkit-transform: translateX(100%);
        opacity: 0;
    }
    to {
        -webkit-transform: translateX(0);
        opacity: 1;
    }
}
@keyframes fromleft {
    from {
        transform: translateX(100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

@-webkit-keyframes scale-in{
    from {
        -webkit-transform: scale(2);
        opacity: 0;
    }
    to {
        -webkit-transform: scale(1);
        opacity: 1;
    }
}
@keyframes scale-in{
    from {
        -webkit-transform: scale(2);
        opacity: 0;
    }
    to {
        -webkit-transform: scale(1);
        opacity: 1;
    }
}

.recharge{
    p{
        background-color: $c-green;
        color: #fff;
        font-size: 16px;
        font-weight: bold;
        text-align: center;
        padding: 10px 0;
    }
    .ul{
        background-color: $c-green;
        color: #fff;
        border-radius: 5px;
        margin: 30px;
        padding: 10px;
    }
    ul{
        margin: 30px;
        li{
            em{
                color: red;
            }
            padding: 5px 0;
            &:nth-of-type(1){
                @include dur(.6s);
            }
            &:nth-of-type(2){
                @include dur(.9s);
            }
            &:nth-of-type(3){
                @include dur(1.2s);
            }
            &:nth-of-type(4){
                @include dur(1.5s);
            }
            &:nth-of-type(5){
                @include dur(1.8s);
            }
            &:nth-of-type(6){
                @include dur(2.1s);
            }
            &:nth-of-type(7){
                @include dur(2.4s);
            }
            &:nth-of-type(8){
                @include dur(2.7s);
            }
            &:nth-of-type(9){
                @include dur(3s);
            }
        }
    }
    button{
        border: 1px solid $c-green;
        color: $c-green;
        font-size: 16px;
        background-color: #fff;
        border-radius: 10px;
        padding: 2px 5px;
        margin: 30px auto;
        width: 76px;
        display: block;
    }
}